<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@page contentType="text/html" pageEncoding="UTF-8" %>

<script type="text/javascript">
    function setDialogInstanceCompleted() {
    	//Check Exit Page Url,if Exists Then Jump It,Else Don't Jump    	 
        if (confirm("Are you sure you have finished this dialog and exit? If 'Yes' you will not modify your answers anymore."))
            $.get("<%=request.getContextPath()%>/main/setDialogInstanceStatus.html?dialogInstanceId=" +
                  "${dialogInstanceId}&completed=true", function(result) {
                if (result == "success") {
                    alert("This Dialog is finished.");
                    window.location.href = "<%=request.getContextPath()%>";
                }
            });
            $.get("<%=request.getContextPath()%>/main/exitpage.html?dialogId=" +
                  "${questinnaireId}", function(result) {
                if (result != "") {
                    window.location.href = result;
                }else{
                	return false;
                }
            });
    }
</script>

<div class="content">
    <div class="boxTop">
        <div class="boxTopRt"><span></span></div>
    </div>
    <div class="boxMid">
        <div class="boxMidRt">
            <div class="content_top">
                <h2>This is the Summary of your Dialog.</h2>
                <ul class="way">
                    <li class="btn_backwards">
                        <input type="button" value="" class="btn_back"
                       onclick="javascript:window.location.href='<%=request.getContextPath()%>/general/restart.html?dialogInstanceId=${dialogInstanceId}'"/>
                    </li>
                </ul>
            </div>
            <div class="incontent">
                <div class="inBoxTop">
                    <div class="inBoxTopRt"><span></span></div>
                </div>
                <div class="inBoxMid">
                    <div class="inBoxMidRt">
                        <div class="step_box">
                            <div class="box_active">
                                <div class="boxActiveTop">
                                    <div class="boxActiveTopRt"><span></span></div>
                                </div>
                                <div class="boxActiveMid">
                                    <div class="boxActiveMidRt">
                                        <div class="question_cont ordinal">
                                            If you have completed this dialog, please click this button:
                                            <input type="button" value="" onclick="setDialogInstanceCompleted()" class="btn_finished"/>
                                            <c:forEach items="${pages}" var="page">
                                                <h3>${page.title}</h3>
                                                <hr/>
                                                <c:forEach items="${page.questions}" var="question">
                                                    <strong>${question.text}</strong>
                                                    <br/>
                                                    <c:if test="${fn:length(question.responses) > 0}">
                                                        Your answers are:
                                                    </c:if>
                                                    <br/>
                                                    <ul>
                                                        <c:forEach items="${question.responses}" var="response">
                                                            <li>${response}</li>
                                                        </c:forEach>
                                                    </ul>
                                                    <c:if test="${fn:length(question.responses) > 0}">
                                                        <hr/>
                                                    </c:if>
                                                </c:forEach>
                                            </c:forEach>
                                        </div>
                                    </div>
                                    <div class="boxActiveBtm">
                                        <div class="boxActiveBtmRt"><span></span></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="inBoxBtm">
                    <div class="inBoxBtmRt"><span></span></div>
                </div>
            </div>
            <div class="content_btm">
            </div>
        </div>
    </div>
    <div class="boxBtm">
        <div class="boxBtmRt"><span></span></div>
    </div>
</div>